<template>
  <div class="messbase-split" :style="{height:getTopHeight}">
    <Split v-model="split1">
      <div slot="left" class="messbase-split-pane">Left Pane</div>
      <div slot="right" class="messbase-split-pane">Right Pane</div>
    </Split>
  </div>
</template>
<script>
export default {
  data() {
    return {
      props: ["file"],
      split1: 0.2,
    };
  },
  computed: {
    getTopHeight: function () {
      return this.$store.getters.getTopHeight - 32 + "px";
    },
  },
};
</script>
<style>
.messbase-split {
  height: 100%;
  border: 1px solid #dcdee2;
}
.messbase-split-pane {
  padding: 0px;
}
</style>
